<template>
    <table>
        <tr>
            <td>
                借款项目名称
            </td>
            <td>
                <input type="text" v-model="B_Name" />
            </td>
        </tr>
        <tr>
            <td>
                借款金额
            </td>
            <td>
                <input type="text" v-model="B_All" />
            </td>
        </tr>
        <tr>
            <td>
                借款年限
            </td>
            <td>
                <input type="text" v-model="B_Year" />
            </td>
        </tr>
        <tr>
            <td>
                借款金额
            </td>
            <td>
                <input type="text" v-model="UI_Mon" @change="Save" />
            </td>
        </tr>
        <tr>
            <td>
                每月还款
            </td>
            <td>
                <input type="text" v-model="UI_M" />
            </td>
        </tr>
        <tr>
            <td>

            </td>
            <td>
                <input type="button" value="我要借款" @click="Borrow" />
            </td>
        </tr>

    </table>
</template>
<script lang="ts" setup>
import { ref } from 'vue';
import { useRoute } from 'vue-router';
import { onMounted } from 'vue';
import axios from 'axios';
const B_Name = ref('');
const B_All = ref('');
const B_Year = ref('');
const route = useRoute();

const BId = route.params.BId;
alert(BId);
const UI_Mon = ref('');
const UI_M = ref('');
const Save = () => {
    UI_M.value = (Number(UI_Mon.value) / 12).toFixed(2);

}
onMounted(() => {
    axios.get('http://localhost:25190/api/Demo/Fan', {
        params: {
            BId: BId
        }
    })
        .then(res => {
            B_Name.value = res.data.B_Name;
            B_All.value = res.data.B_All;
            B_Year.value = res.data.B_Year;

        })
        .catch(err => {
            console.log(err);
        })
})
const Borrow = () => {
    alert("借款成功");
}

</script>